<template>
    <div>
        <div class="top_banner">
            <h1>滨海自来水</h1>
            <img src="@/assets/tap-water/images/top_bg.jpg" alt="">
        </div>
        <ul class="gs">
            <li>
                <router-link :to="{path:'/tap-water/list',query:{title:'水质公示',url:'/tap-water/szgs',type:'03'}}">
                    <span>
                    <img src="@/assets/tap-water/images/icon06.png" alt="">
                    水质公示
                    </span>
                    <img src="@/assets/tap-water/images/fh03.png" alt="">
                </router-link>
            </li>
            <!--<li>
                <a href="javascript:void(0);" onclick="sc.toast({text:'暂未开通，敬请期待...'})">
                    <span>
                    <img src="@/assets/tap-water/images/icon01.png" alt="">
                    水费缴纳
                    </span>
                    <img src="@/assets/tap-water/images/fh03.png" alt="">
                </a>
            </li>
            <li>
                <a href="javascript:void(0);" onclick="sc.toast({text:'暂未开通，敬请期待...'})">
                    <span>
                    <img src="@/assets/tap-water/images/icon02.png" alt="">
                    缴纳查询
                    </span>
                    <img src="@/assets/tap-water/images/fh03.png" alt="">
                </a>
            </li>-->
            <li>
                <router-link :to="{path:'/tap-water/list',query:{title:'停水公告',url:'/tap-water/tsgg',type:'00'}}">
                    <span>
                    <img src="@/assets/tap-water/images/icon03.png" alt="">
                    停水公告
                    </span>
                    <img src="@/assets/tap-water/images/fh03.png" alt="">
                </router-link>
            </li>
            <li>
                <router-link :to="{path:'/tap-water/sjxx',query:{type:'01'}}">
                    <span>
                    <img src="@/assets/tap-water/images/icon04.png" alt="">
                    水价信息
                    </span>
                    <img src="@/assets/tap-water/images/fh03.png" alt="">
                </router-link>
            </li>
            <li>
                <router-link :to="{path:'/tap-water/yscs',query:{type:'02'}}">
                    <span>
                    <img src="@/assets/tap-water/images/icon05.png" alt="">
                    用水常识
                    </span>
                    <img src="@/assets/tap-water/images/fh03.png" alt="">
                </router-link>
            </li>

        </ul>
    </div>
</template>

<script>

    import Vue from 'vue'
    import axios from 'axios'

    // code:部门 100：卫健委；101：体育局；102：供水公司；103：住建局；104：文广旅居
    async function initSdk(appId, keyId, userDataTypes) {
        const baseUrl = Vue.prototype.baseUrl; // 服务器地址
        // 初始化api sdk
        await fetchInitCode(appId, keyId, userDataTypes, baseUrl)
    }

    // 初始化api sdk
    async function fetchInitCode(appId, keyId, userDataTypes, baseUrl) {
        const time = sessionStorage.getItem('initCodeTime');
        if (time) {
            // 有code时直接运行
            const lastTime = new Date().getTime() - time;
            if (lastTime < 300000) {
                return
            }
        }
        await axios
            .get(`${baseUrl}/getInitCode/${keyId}`, {timeout: 20000})
            .then((res) => {
                const {initCode} = res.data.data;
                sessionStorage.setItem('initCodeTime', new Date().getTime());

                if (!initCode) return;

                console.log("开始初始化，校验是否弹出授权");

                // 初始化api sdk
                sc.config({
                    debug: false, // 是否开启调试模式,调用的所有 api 的返回值会在客户端 alert 出来
                    appId: appId, // 在统一 APP 开放平台服务器申请的 appId
                    initCode: initCode
                });

                //注册成功之后执行
                sc.ready(() => {
                    console.log("初始化完成");
                });

                sc.error(() => {
                    sc.toast({
                        text: 'SDK初始化失败~~',
                    });
                    sessionStorage.setItem('initCodeTime', '')
                })
            })

            .catch(function () {
                sc.toast({
                    text: '网络正在开小差~~',
                });
            })
    }

    export default {
        name: "home",
        created() {
            initSdk("b58b51c4dd764a568194f2d106be207d", "102"); //自来水
            // initSdk("b7210844ab944e488304a0d51de43349", "999"); //测试账号
        },
    }


</script>

<style scoped></style>
